<template>
  <div class="Tables">
    <!-- 表格 -->
    <studenthead :tabData='tabData' @handleSizeChange='handleSizeChange' @handleCurrentChange='handleCurrentChange'
      v-if="issuccess">
      <el-table-column prop="status" label="学员状态" align="center">
        <template slot-scope='scope'>
          <span :class="scope.row.status.class" v-if="scope.row.status.title">{{scope.row.status.title}}</span>
          <span v-else>-</span>
        </template>
      </el-table-column>
      <!-- actual_cost == '' 暂未缴费  -->
      <!-- enroll_cost - actual_cost 》0 部分缴费 <=0 完全缴费 -->
      <el-table-column prop="" label="交费状态" align="center" width="150">
        <template slot-scope='scope'>
          <span v-if="scope.row.actual_cost==''">暂未缴费</span>
          <span v-else-if="scope.row.enroll_cost-scope.row.actual_cost>0">部分缴费</span>
          <span v-else>缴费完成</span>
        </template>
      </el-table-column>

      <el-table-column prop="" label="建档状态" align="center">
        <template slot-scope='scope'>
          <span v-if="scope.row.record_state.title" :class="scope.row.record_state.class">{{scope.row.record_state.title}}</span>
          <span v-else>-</span>
        </template>
      </el-table-column>
      <el-table-column prop="learn" label="学车进度" align="center">
        <template slot-scope='scope'>
          <span v-if="scope.row.learn_rate.title">{{scope.row.learn_rate.title}}</span>
          <span v-else></span>
        </template>
      </el-table-column>

      <el-table-column prop="write_time" label="报名日期" align="center"></el-table-column>
      <el-table-column prop="state" label="审批状态" align="center">
        <template slot-scope='scope'>
          <span v-if="scope.row.state.title">{{scope.row.state.title}}</span>
          <span v-else></span>
        </template>
      </el-table-column>
      <el-table-column prop="" label="操作" align="center" width="250">

        <template slot-scope="scope">
          <el-link @click="editform(scope.row.id)" type="primary" v-if="checkPermission(['studentEdit'])" :disabled='scope.row.status.value==2 || scope.row.status.value==4 ' :underline='false'>编辑</el-link>
          <el-link @click="repair(scope.row.id)" type="primary" v-if="checkPermission(['studentMakeUp'])" :disabled='scope.row.enroll_cost-scope.row.actual_cost<=0||scope.row.operateStatus.rePay || scope.row.status.value==2 || scope.row.status.value==4 '
            :underline='false'>补交</el-link>
       
           <el-link  type="primary" v-if="scope.row.status.value==2 || scope.row.status.value==4 " disabled
            :underline='false'>更多操作<i class="el-icon-arrow-down el-icon--right"></i></el-link>
               <el-dropdown @command="handleCommand" trigger="click" v-else>
            <span class="el-dropdown-link edittext" v-if="checkPermission(['studentExamCost','studentChangeCourse','studentOutToSchool','studentReRecord','studentReTrain','studentRefund'])">更多操作<i class="el-icon-arrow-down el-icon--right"></i></span>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item :disabled='scope.row.operateStatus.reExam' v-if="checkPermission(['studentExamCost'])"
                :command="beforeHandleCommand('testfee',scope.row.id,scope.row.name)">收考试费</el-dropdown-item>
              <!-- <el-dropdown-item :command="beforeHandleCommand('progress',scope.row.id)">修改学车进度</el-dropdown-item> -->
              <el-dropdown-item :disabled='scope.row.operateStatus.reCourse ' v-if="checkPermission(['studentChangeCourse'])"
                :command="beforeHandleCommand('changeshifts',scope.row.id,scope.row.name)">换班</el-dropdown-item>
              <el-dropdown-item :disabled='scope.row.operateStatus.dropOut' v-if="checkPermission(['studentOutToSchool'])"
                :command="beforeHandleCommand('dropout',scope.row.id,scope.row.name)">退学</el-dropdown-item>
              <el-dropdown-item :disabled='scope.row.operateStatus.reStudy' v-if="checkPermission(['studentReRecord'])"
                :command="beforeHandleCommand('newdocument',scope.row.id,scope.row.name)">重新建档</el-dropdown-item>
              <el-dropdown-item :disabled='scope.row.operateStatus.reTrain' v-if="checkPermission(['studentReTrain'])"
                :command="beforeHandleCommand('drill',scope.row.id,scope.row.name)">复训补交</el-dropdown-item>
              <el-dropdown-item :disabled='scope.row.operateStatus.reFund' v-if="checkPermission(['studentRefund'])"
                :command="beforeHandleCommand('retreat',scope.row.id,scope.row.name)">学员退款</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </template>
      </el-table-column>
    </studenthead>
    <!-- 学车进度弹窗 -->
    <progressdialog @refreshData='refreshData' v-if="isshowpro" :isshowDialogs='isshowpro' @closetextDialog='closepro'
      :rowid='rowid' @confirmbtn='confirmpro'></progressdialog>

    <!-- 收考试费弹窗 -->
    <testfeedialog :repairId='repairId' :dialogparams='dialogparams' :isshowDialogs='isshowtest' @closetextDialog='closetest'
      @confirmbtn='confirmtest'></testfeedialog>

    <!-- 补交弹窗 -->
    <repairdialog :dialogparams='dialogparams' :isshowDialog='isshowrepair' :dialogTitle='"学费补交"' @closedialog='closerepair'
      :repairId='repairId' @confirm='repairconfirm'></repairdialog>

    <!-- 换班弹窗 -->
    <changedialog :dialogparams='dialogparams' :isshowDialog='isshowchange' @closetextDialog='closechange' v-if="isshowchange"
      :repairId='repairId' @refreshData='refreshData'></changedialog>

    <!-- 退学弹窗 -->
    <dropoutdialog :isshowDialog='isshowdropout' @confirmdropout='confirmdropout' :dialogparams='dialogparams'
      @closetextDialog='closedropout'></dropoutdialog>

    <!-- 重新建档 -->
    <newdocdialog :isshowDialog='isshownewdoc' @confirmnewdoc='confirmnewdoc' :dialogparams='dialogparams'
      @closetextDialog='closenewdoc'></newdocdialog>

    <!-- 复训补交 -->
    <drilldialog :isshowDialog="isshowdrill" @confirmdrill='confirmdrill' :dialogparams='dialogparams' @closetextDialog='closedrill'></drilldialog>

    <!-- 退费弹窗 -->
    <retreatdialog @confirmretreat='confirmretreat' @confirmdrill='confirmdrill' :reDate='reDate' :isshowDialog="isshowreturn"
      @closetextDialog='closereturn' :dialogparams='dialogparams'></retreatdialog>

  </div>
</template>

<script>
  //表格表头一样
  import studenthead from '@/components/studenthead'
  //五次不过弹窗
  import newdocdialog from './newdocdialog.vue'
  //学车进度弹窗
  import progressdialog from './progressdialog'
  //收考试费弹窗
  import testfeedialog from './testfeedialog'
  //补交弹窗
  import repairdialog from './repairdialog'
  //换班弹窗
  import changedialog from './changedialog'
  //退学弹窗
  import dropoutdialog from './dropoutdialog'
  //复训弹窗
  import drilldialog from './drilldialog'
  //退费弹窗
  import retreatdialog from './retreatdialog'
  //api
  import {
    getRefund
  } from '@/api/student'

  //按钮权限验证
  import checkPermission from "@/utils/permission";
  export default {
    data() {
      return {
        //数据是否加载成功
        issuccess: false,
        //退费数据
        reDate: {},
        //弹窗参数
        dialogparams: {},
        // 补交id
        repairId: null,
        //复训弹窗
        isshowdrill: false,
        //是否显示退费弹窗
        isshowreturn: false,
        //是否显示重新建档
        isshownewdoc: false,
        //是否显示退学弹窗
        isshowdropout: false,
        //是否显示换班弹窗
        isshowchange: false,
        //是否显示补交弹窗
        isshowrepair: false,
        //是否显示学车进度弹窗
        isshowpro: false,
        //是否显示收考试费弹窗
        isshowtest: false,
        //表格数据
        tableData: [],
        //页码数据
        pages: {},
        //行id
        rowid: 0
      }
    },
    props: {
      //表格数据
      tabData: {
        type: Object,
        default: () => {
          return {}
        },
      },
    },
    mounted() {
      this.tableData = this.tabData.list
      this.pages = this.tabData.page
      this.issuccess = true
    },
    components: {
      progressdialog,
      testfeedialog,
      repairdialog,
      changedialog,
      dropoutdialog,
      newdocdialog,
      studenthead,
      drilldialog,
      retreatdialog
    },
    watch: {
      tabData(val) {
        this.tableData = val.list
        this.pages = val.page
      },
    },
    methods: {
      checkPermission,
      //退费成功 关闭弹窗
      confirmretreat() {
        this.isshowreturn = false
        //刷新列表
        this.$emit('refreshData')
      },
      //暂无退费数据
      closeretreat() {
        this.isshowreturn = false
      },
      //复训成功
      confirmdrill() {
        this.isshowdrill = false
        //刷新列表
        this.$emit('refreshData')
      },
      //重新建档成功
      confirmnewdoc() {
        this.isshownewdoc = false
        //刷新列表
        this.$emit('refreshData')
      },
      //退学成功 关闭弹窗
      confirmdropout() {
        this.isshowdropout = false
        this.$emit('refreshData')
      },
      //关闭退费
      closereturn() {
        this.isshowreturn = false
      },
      //关闭复训
      closedrill() {
        this.isshowdrill = false
      },
      //刷新列表
      refreshData() {
        this.$emit('refreshData')
      },
      //补交确认成功
      repairconfirm() {
        this.isshowrepair = false
        this.$emit('refreshData')
      },
      //关闭重新建档
      closenewdoc() {
        this.isshownewdoc = false
      },
      //退学关闭
      closedropout() {
        this.isshowdropout = false
      },
      //关闭换班弹窗
      closechange() {
        this.isshowchange = false
      },
      //关闭补交弹窗
      closerepair() {
        this.isshowrepair = false
      },
      //补交 弹窗
      repair(id) {
        this.dialogparams = {
          id: id
        }
        this.repairId = id
        this.isshowrepair = true
      },
      //关闭 考试收费
      closetest() {
        this.isshowtest = false
      },
      //确认弹窗 考试收费
      confirmtest() {
        this.isshowtest = false
        this.$emit('refreshData')
      },
      //确认弹窗 修改学车进度
      confirmpro() {
        this.isshowpro = false
        //刷新列表
        this.$emit('refreshData')
      },
      //关闭弹窗 修改学车进度
      closepro() {
        this.isshowpro = false
      },
      //点击更多
      handleCommand(command) {
        //退出登录
        switch (command.command) {
          case 'testfee':
            this.repairId = command.row
            this.dialogparams = {
              id: command.row,
              name: command.name
            }
            this.isshowtest = true
            break
          case 'progress':
            this.repairId = command.row
            this.isshowpro = true
            break
          case 'dropout':
            this.repairId = command.row
            this.dialogparams = {
              id: command.row,
              name: command.name
            }
            this.isshowdropout = true
            break
          case 'changeshifts':
            this.repairId = command.row
            this.dialogparams = {
              id: command.row,
              name: command.name
            }
            this.isshowchange = true
            break
          case 'newdocument':
            this.repairId = command.row
            this.dialogparams = {
              id: command.row,
              name: command.name
            }
            this.isshownewdoc = true
            break
          case 'retreat':
            this.repairId = command.row
            this.dialogparams = {
              id: command.row,
              name: command.name
            }
            this.getRefundDetail(command.row)
            break
          case 'drill':
            this.repairId = command.row
            this.dialogparams = {
              id: command.row,
              name: command.name
            }
            this.isshowdrill = true
            break
        }
        this.rowid = command.row
      },
      //查询退费详情
      async getRefundDetail(id) {
        let params = {
          student_id: id
        }
        let data = await getRefund(params)
        if (data.code == '0000') {
          this.isshowreturn = true
          this.reDate = data.data
        } else {
          this.isshowreturn = false
        }
      },
      beforeHandleCommand(item, row, name) {
        return {
          'command': item,
          'row': row,
          'name': name
        }
      },
      //关闭费用弹窗
      closeprcie() {
        this.isshowPrcie = false
      },
      //翻页总数
      handleSizeChange(val) {
        this.$emit('changepageTotal', val)
      },
      //翻页
      handleCurrentChange(val) {
        this.$emit('changepage', val)
      },
      //编辑
      editform(id) {
        let params = {
          id,
          type: 1,
        }
        //显示dialog通知父组件打开弹窗
        this.$emit('openedit', params)
      },

      //删除
      deleteitem(id) {
        this.$emit('deleteitem', id)
      },
    },
  }
</script>

<style scoped lang='scss'>
  .Tables {
    margin-top: 25px;
  }

  .edittext {
    margin: 0 10px;
    color: #4c68ef;
    cursor: pointer;
    font-size: 13px;
  }

  .pagination {
    margin-top: 10px;
    display: flex;
    justify-content: flex-end;
  }
</style>
